import Taro, { Component } from '@tarojs/taro'
import { Swiper, SwiperItem, Image, View, Text } from '@tarojs/components'
import Goodshearder from './goodshearder'
import '../../assets/common.scss'
import CommonJs from '../../utils/common'
import '../my/unpaid.scss'
import '../../assets/animate.min.scss'
import './cloud.scss'

import close from '../mall/images/close.png'

export default class Index extends Component {
  constructor(props) {
  	super(props);
    this.state = {
    	goodslist:[],
    	goodsinfo:{},
    	ggindex:'',
    	goodsnum:0,
    	showgg:0,
    	address:'',
    	shoplist:[],
      pageheight:0,
	  	pageNumber:0,//页码数
      scrollPd:false,//是否可滑动
      hasNextPage:false,//是否有下一页
    }
  }
  config = {
    navigationBarTitleText: '云采购订单'
  }

  componentWillMount () {
  	var _this=this
  	Taro.getSystemInfo({
      success:function(res){
        _this.setState({
          pageheight: res.windowHeight
        })
      }
    })
		this.getdata(0)
		this.getshoplist();
  }
  componentDidMount () {}
  componentDidShow () {
  	var pages = getCurrentPages();
    var Page = pages[pages.length - 1];
    var info = Page.data.data;
    if(info){
      this.setState({
        address:info
      })
      
    }
  }
  getshoplist(){
  	var url='/shop/papi/v1.9/shops/accountId/list'
  	var _this=this;
  	CommonJs.ajaxRequest(url,'','GET',function(res){
  		_this.setState({
			  shoplist:res.data
			})
  	},'wfw')
  }
  getdata(pageNumber){
  	 var _this=this;
  	 
  	 var url='/yunwarehouse/papi/v1.9/yun-inventory';
    CommonJs.ajaxRequest(url,'','GET',function(res){
		if(res.data.page<res.data.totalPages){
			var hasNextPage = true
		 }
		 else{
			var hasNextPage = false
		 }
		  var results = _this.state.goodslist
		  var result = res.data.list;
		  for(var i = 0; i < result.length; i++){
			results.push(result[i])
		  }
		  if (hasNextPage) {
			_this.setState({
			  goodslist:results,
			  pageNumber: res.data.page,
			  hasNextPage: hasNextPage,
			  scrollPd: true
			})
		  }
		  else {
			_this.setState({
			  goodslist:results,
			  pageNumber: res.data.page,
			  hasNextPage: hasNextPage,
			  scrollPd: false
			})
		  }

    },'wfw')
  }
  loadMore(){
    var _this = this;
    var pd = _this.state.scrollPd;
    if(pd) {
      //防止多次触发滑动到底部事件
      _this.setState({
        scrollPd: false//禁止下拉
      })
      var pageNumber = _this.state.pageNumber + 1;
      _this.getunpaid(pageNumber)
    }else{
      var hasNextPage =  _this.state.hasNextPage;
      if(hasNextPage){
        Taro.showToast({
            title:'正在加载数据...',
            icon: 'none',
            duration: 2000
          });
      }else{
        Taro.showToast({
            title:'没有更多数据啦！',
            icon: 'none',
            duration: 2000
          });
      }
    }
  }
  open(url){
    CommonJs.open(url);
  }
  openxq(url,type){
  	this.$preload({
      type:type
    })
    CommonJs.openTo(url);
  }
  reducegoods(){
	var num=this.state.goodsnum;
	if(num>1){
	  num=num-1
	  this.setState({
			goodsnum:num
	  })
	}
	else{
		Taro.showToast({
		  title:'购买数量不能少于1哟',
		  icon: 'none',
		  duration: 2000
		})
	}
  }
  addgoods(){
	  var num=this.state.goodsnum;
	  var index=this.state.ggindex;
	  var goodsinfo=this.state.goodsinfo;
	  if(num<goodsinfo.amount){
		  num=num+1
		  this.setState({
			goodsnum:num
		  })
	  }
	  else{
		Taro.showToast({
		  title:'库存不够啦',
		  icon: 'none',
		  duration: 2000
		})
	  }
  }
  showggfun(val){
	  if(val==1){
		this.setState({
		  showgg:1
		})
	  }
	  else{
		this.setState({
		  showgg:0
		})
	  }
  }
  dofh(index){
  	var goodslist=this.state.goodslist;
  	this.setState({
		  showgg:1,
		  ggindex:index,
		  goodsnum:goodslist[index].amount,
		  goodsinfo:goodslist[index]
		}) 
  }
  shangjia(id){
  	//console.log('/pages/cloud/shangjia?id=')
  	CommonJs.open('/pages/cloud/shangjia?id='+id);
  }
  sure(){
  	var  address=this.state.address;
  	var arr=[];
  	var obj={}
  	if(address){
  		obj={
	      "yunInventoryId":this.state.goodsinfo.id ,
	      "amount":this.state.goodsnum,
	      "addressId": address.id
	    }
  		arr[0]=obj
  		var dates={
  			goosYunInventoryList:arr
  		}
  		var url='/yunwarehouse/papi/v1.9/ticket/accountDelivery'
  		var _this=this;
	    CommonJs.ajaxRequest(url,dates,'PUT',function(res){
	    	Taro.showToast({
				  title:'操作成功，请等候商家发货',
				  icon: 'none',
				  duration: 2000
				})
	    	_this.setState({
				  showgg:0
				}) 
	    	setTimeout(function(){
	    		_this.getdata(0)
	    	},2000)
	    },'wfw')
  	}
  	else{
  		Taro.showToast({
			  title:'请选择收货地址',
			  icon: 'none',
			  duration: 2000
			})
  	}
  }
    render () {
    const result = this.state.goodslist
    const address=this.state.address
    return (
      <View className='page'>
        <View className='qun-bgbanner'>
          	<View className='change'>
	        		<View className='change-li' onClick={this.open.bind(this,'/pages/cloud/cgorder')}>采购订单<Text className='xz'></Text></View>
	        		<View className='change-li change-licur' onClick={this.open.bind(this,'/pages/cloud/cggoods')}>采购商品<Text className='xz'></Text></View>
	        	</View>
        </View>
        <ScrollView className='qun-goods' scrollY='true' style={'height:'+this.state.pageheight+'px;margin-top:90rpx'} onScrollToLower={this.loadMore.bind(this,'')}>
        <View className='qun-znwn' style={result.length!=0?'display:none':'display:block;'}>暂无订单</View>
        {result.map((item, index) => (
        <View className='goodsorder-content'>
          <View className='goodsorder-unpaid'>
            <View className='unpaid-title'>
              <View className='qun-scallty'>
                <Image mode='scaleToFill' className='unpaid-photo' src='https://minichat.g2ma.com/kedouimg/store.png'></Image>
                <View className='unpaid-shopname'><Text className='unpaid-tel'>{item.shopName}</Text></View>
              </View>
            </View>
            <View className='unpaid-content'>
             
              <View className='unpaid-goods'>
							<View className='unpaid-pic'>
								<Image mode='scaleToFill' className='unpaid-pic-img' src={item.itemPicture?item.itemPicture:CommonJs.getlogo()}></Image>
			                </View>
											<View className='unpaid-right'>
			                  <View className='unpaid-goodsname'>{item.itemName}</View>
			                  <View className='unpaid-specifications'>规格：{item.itemSku}</View>
			                  <View className='unpaid-total'>
			                    <View className='unpaid-num'>数量：{item.amount}</View>
			                    <View className='unpaid-price'>{item.price/100}</View>
			                    
			                  </View>
			                </View>
			              </View>
						  
              
              <View className='unpaid-postage'>
              <View className='unpaid-time' style='text-aling:left;'>{CommonJs.FormatDate(item.createAt,3)}</View>
              </View>

            </View>
           <View className='unpaid-order'>
           		<Text className='unpaid-cancel' style={this.state.shoplist&&this.state.shoplist.length>0&&(item.grounding==1||item.ucGrounding==1||item.wucGrounding==1)?'':'display:none;'} onClick={this.shangjia.bind(this,item.id)}>上架商品</Text>
              <Text className='unpaid-cancel' onClick={this.dofh.bind(this,index)}>申请发货</Text>
            </View>
           
          </View>
        </View>
        ))}
        </ScrollView>
        <View className={this.state.showgg==1?'choose-gg animated bounceInUp':'choose-gg hiddgg'} style="bottom:0;border-radius:0;border-top:20rpx solid #eee">
					 <View className='goods-li'>
						<View className='cat-li-img'>
							<Image className="cat-img" mode='scaleToFill' src={goodsinfo.itemPicture}></Image>
						</View>
						<View className='sp-info'>
							<Text className='sp-name'>{goodsinfo.itemName}</Text>
							<Text className='sp-price'>￥{goodsinfo.price/100}</Text>
							<Text className='sp-kc'>库存：{goodsinfo.amount}件</Text>
						</View>
					</View>
					<View className='choose-gg01'>
						<View className='choose-gg-tit'>商品规格</View>
						<View className='choose-gg-list'>
							<Text className='gg'>{goodsinfo.itemSku}</Text>
						</View>
					</View>
					<View className='choose-gg01' onClick={this.openxq.bind(this,'/pages/my/address','order')}>
						<View className='choose-gg-tit'>收货地址</View>
						<View className='choose-gg-list'>
							<Text className='gg ggcur'>{address?address.name+" "+address.mobile+" "+address.regionName:'点击选择'}</Text>
						</View>
					</View>
					<View className='choose-gg01 choose-sl'>
						<View className='choose-gg-tit'>数量</View>
						<View className='choose-gg-list'>
							<Text className='jian' onClick={this.reducegoods}>-</Text>
							<Text className='input'>{this.state.goodsnum}</Text>
							<Text className='jia' onClick={this.addgoods}>+</Text>
						</View>
					</View>
					<Image className="choose-close" mode="widthFix" src={close}  onClick={this.showggfun.bind(this,0)}></Image>
					<Text className='buy' onClick={this.sure.bind(this)} style='width:100%;border-radius:10rpx;margin:0 auto;display:block;'>确认提交</Text>
				</View>
      </View>
    )
  }
}